<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>创建BFC的元素，它的边框盒不会与浮动元素重叠</title>
	<style type="text/css">
		.float {
			float: left;
			width: 200px;
			height: 200px;
			margin: 20px;
			background: lightblue;
		}

		.container{
			height: 500px;
			background: #008c8c;
			/*bfc*/
			overflow: hidden;
		}
	</style>
</head>
<body>
	<div class="float"></div> <!-- 浮动盒子 -->
	<div class="container"></div>
</body>
</html>